//图片上下滚动
var count = ($("#imageMenu li").length - 4) <=0 ? 1 :$("#imageMenu li").length - 4 ; /* 显示 6 个 li标签内容 */
var interval = $("#imageMenu li:first").width()+5;
var curIndex = 0;
if(count<=6) $('.smallImgDown').addClass('disabled');
$('.scrollbutton').click(function(){
	if( $(this).hasClass('disabled') ) return false;
	if ($(this).hasClass('smallImgUp')) --curIndex;
	else ++curIndex;
	$('.scrollbutton').removeClass('disabled');
	if (curIndex == 0) $('.smallImgUp').addClass('disabled');
	if (curIndex == count-1) $('.smallImgDown').addClass('disabled');
	$("#imageMenu ul").stop(false, true).animate({"marginLeft" : -curIndex*interval + "px"}, 600);
});

$("#imageMenu li img").bind('click', function (){
	if (! $(this).hasClass('active')) {
		midChange($(this).attr("src"));
		$(this).parent().addClass("active").siblings('li').removeClass('active');
	}
})

function midChange(src) {
        $("#midimg").attr("src", src).load(function() {
            changeViewImg();
        });
}
function changeViewImg() {
    $("#bigView img").attr("src", $("#midimg").attr("src"));
}
changeViewImg();

//大视窗看图
function mouseover(e) {
	var $imgWidth = $("#midimg").width(); //中图宽度
	var $imgHeight = $("#midimg").height(); //中图高度
   if($imgWidth<400 || $imgHeight<425) return false;
    if ($("#winSelector").css("display") == "none") {
        $("#winSelector,#bigView").show();
    }
    $("#winSelector").css(fixedPosition(e));
    e.stopPropagation();
}


function mouseOut(e) {
    if ($("#winSelector").css("display") != "none") {
        $("#winSelector,#bigView").hide();
    }
    e.stopPropagation();
}

var $divWidth = $("#winSelector").width(); //选择器宽度
var $divHeight = $("#winSelector").height(); //选择器高度
var $viewImgWidth = $viewImgHeight = $height = null; //IE加载后才能得到 大图宽度 大图高度 大图视窗高度

$("#midimg").mouseover(mouseover); //中图事件
$("#midimg,#winSelector").mousemove(mouseover).mouseout(mouseOut);
//选择器事件
$("#bigView").scrollLeft(0).scrollTop(0);
function fixedPosition(e) {
    if (e == null)  return;
	var $imgWidth = $("#midimg").width(); //中图宽度
	var $imgHeight = $("#midimg").height(); //中图高度
    var $imgLeft = $("#midimg").offset().left; //中图左边距
    var $imgTop = $("#midimg").offset().top; //中图上边距
    X = e.pageX - $imgLeft - $divWidth / 2; //selector顶点坐标 X
    Y = e.pageY - $imgTop - $divHeight / 2; //selector顶点坐标 Y
    X = X < 0 ? 0 : X;
    Y = Y < 0 ? 0 : Y;
    X = X + $divWidth > $imgWidth ? $imgWidth - $divWidth : X;
    Y = Y + $divHeight > $imgHeight ? $imgHeight - $divHeight : Y;

    if ($viewImgWidth == null) {
        $viewImgWidth = $("#bigView img").outerWidth();
        $viewImgHeight = $("#bigView img").height();
        if ($viewImgWidth < 200 || $viewImgHeight < 200) {
            $viewImgWidth = 800;
            $viewImgHeight = 850;
        }
        $height = $divHeight * $viewImgHeight / $imgHeight;
        $("#bigView").width($divWidth * $viewImgWidth / $imgWidth);
        $("#bigView").height($height);
     }
    var scrollX = X * $viewImgWidth / $imgWidth;
    var scrollY = Y * $viewImgHeight / $imgHeight;
    $("#bigView img").css({ "left": scrollX * -1, "top": scrollY * -1 });
    $("#bigView").css({ "top": 0, "left": $(".preview").width()+15});
    return { left: X, top: Y };
}

$('.detail_box .container .showmain .history').hover(function (){
	$(this).find('a.button.prev').stop().animate({top:'30px'},300);
	$(this).find('a.button.next').stop().animate({bottom:'8px'},300);
}, function (){
	$(this).find('a.button.prev').stop().animate({top:'-30px'},300);
	$(this).find('a.button.next').stop().animate({bottom:'-30px'},300);
})

$('.history').slide({
	mainCell : "ul",
	autoPlay : true,
	effect : "top",
	vis : 2,
	scroll : 1,
	autoPage : true,
	pnLoop : false
});

$(".related_pro").slide({ titCell:".hd ul", mainCell:"ul.prolist", effect:"leftLoop", vis:4,scroll:4, autoPlay:true, autoPage:true, pnLoop : false});
$('.detail_box .container .contain.related .related_pro ul.prolist li.item .imgbox').hover(function (){
	$(this).find('a.link').stop().animate({left: '25%'},150);
},function (){
	$(this).find('a.link').stop().animate({left: '-80%'},150);
})
$('.detail_box .container .contain.related .related_pro ul.prolist li.item').hover(function() {
    $(this).find('img').stop().animate({opacity:'0.35'},150);
},function (){
    $(this).find('img').stop().animate({opacity:'1'},150);
});